<template>
    <div :class="ns.b()" :style="applicationGroupStyle">
        <slot />
    </div>
</template>

<script setup lang="ts">
import { useNamespace } from "@/hooks";

const ns = useNamespace("grid");

const props = defineProps({
    column: {
        type: String,
        default: "4"
    }
});

const applicationGroupStyle = computed(() => ({
    ["grid-template-columns"]: `repeat(${props.column}, 1fr)`
}));
</script>

<style scoped lang="scss">
@import "./index";
</style>
